<template>
    <div class="doctor_main">
        <div class="doc_item van-hairline--bottom">
            <div class="info_l" @click="navigateTo('/doctor-enter')">
                <van-image
                    width="50"
                    round
                    height="50"
                    src="https://img.yzcdn.cn/vant/cat.jpeg"
                />
            </div>
            <div class="info_r">
                <p>
                    <span class="title">沈宁</span>
                    <span class="desc">主任医师</span>
                </p>
                <p>中国医科大学附属第一医院</p>
                <div class="action">
                    <div @click="navigateTo('/pic-arti')">
                        <van-icon name="photo-o" color="#00aac6" size="16" />
                        <span>图文问诊</span>
                    </div>
                    <div @click="navigateTo('/video')">
                        <van-icon
                            name="play-circle-o"
                            color="#00aac6"
                            size="14"
                        />
                        <span>视频问诊</span>
                    </div>
                </div>
            </div>
        </div>
        <div class="doc_item van-hairline--bottom">
            <div class="info_l">
                <van-image
                    width="50"
                    round
                    height="50"
                    src="https://img.yzcdn.cn/vant/cat.jpeg"
                />
            </div>
            <div class="info_r">
                <p>
                    <span class="title">沈宁</span>
                    <span class="desc">主任医师</span>
                </p>
                <p>中国医科大学附属第一医院</p>
                <div class="action">
                    <div>
                        <van-icon name="photo-o" color="#00aac6" size="16" />
                        <span>图文问诊</span>
                    </div>
                    <div>
                        <van-icon
                            name="play-circle-o"
                            color="#00aac6"
                            size="14"
                        />
                        <span>视频问诊</span>
                    </div>
                </div>
            </div>
        </div>
        <div class="doc_item van-hairline--bottom">
            <div class="info_l">
                <van-image
                    width="50"
                    round
                    height="50"
                    src="https://img.yzcdn.cn/vant/cat.jpeg"
                />
            </div>
            <div class="info_r">
                <p>
                    <span class="title">沈宁</span>
                    <span class="desc">主任医师</span>
                </p>
                <p>中国医科大学附属第一医院</p>
                <div class="action">
                    <div>
                        <van-icon name="photo-o" color="#00aac6" size="16" />
                        <span>图文问诊</span>
                    </div>
                    <div>
                        <van-icon
                            name="play-circle-o"
                            color="#00aac6"
                            size="14"
                        />
                        <span>视频问诊</span>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
export default {
    mounted() {
        const title = this.$router.currentRoute.query.title;
        window.document.title = title || "123";
        this.$store.dispatch("ToggleTitle", {
            title
        });
    },
    methods: {
        navigateTo(path) {
            this.$router.push({
                path
            });
        }
    }
};
</script>

<style lang="less" scoped>
.doctor_main {
    overflow: auto;
}
.doc_item {
    .desc {
        color: #999;
        font-size: 12px;
        margin-left: 10px;
    }
    .action {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        width: 100%;
        div {
            width: 80px;
            display: flex;
            align-items: center;
            justify-content: flex-start;
            height: 20px;
            span {
                font-size: 12px;
                margin-left: 5px;
                color: #999;
            }
        }
    }
}
</style>
